<template>
  <div
    v-if="dialogVisible"
    class="custom-dialog"
    :modal="false"
    :style="{ 'margin-left': 'auto', 'margin-right': 0, right: 0 }"
    :close-on-click-modal="false"
  >
    <el-form
      ref="ruleFormRef"
      :rules="rules"
      :model="formAsid"
      status-icon
      label-position="right"
      label-width="100px"
    >
      <!-- <el-form-item label="分类id:" prop="id" v-if="isClassif">
        <el-input disabled placeholder="系统自动生成" v-model="formAsid.mId"></el-input>
      </el-form-item> -->
      <!-- <el-form-item label="基础id:" prop="id" v-if="!isClassif">
        <el-input disabled placeholder="系统自动生成" v-model="formAsid.cId"></el-input>
      </el-form-item> -->
      <el-form-item label="分类编码:" prop="mCode" v-if="isClassif">
        <el-input disabled placeholder="系统自动生成" v-model="formAsid.mCode"></el-input>
      </el-form-item>
      <el-form-item label="基础编码:" prop="cCode" v-if="!isClassif">
        <el-input disabled placeholder="系统自动生成" v-model="formAsid.cCode"></el-input>
      </el-form-item>
      <el-form-item label="分类名称:" prop="mName" v-if="isClassif">
        <el-input v-model="formAsid.mName"></el-input>
      </el-form-item>
      <el-form-item label="基础名称:" prop="cName" v-if="!isClassif">
        <el-input v-model="formAsid.cName"></el-input>
      </el-form-item>
      <el-form-item label="分类状态:" prop="mCode" v-if="isClassif">
        <el-switch v-model="formAsid.mStatus"></el-switch>
      </el-form-item>
      <el-form-item label="基础状态:" prop="cCode" v-if="!isClassif">
        <el-switch v-model="formAsid.cStatus"></el-switch>
      </el-form-item>
      <el-form-item label="分类说明:" prop="mDescription" v-if="isClassif">
        <el-input v-model="formAsid.mDescription"></el-input>
      </el-form-item>
      <el-form-item label="基础说明:" prop="cDescription" v-if="!isClassif">
        <el-input v-model="formAsid.cDescription"></el-input>
      </el-form-item>
      <el-form-item label="上级业务类型:" prop="parentId" v-if="isClassif">
        <el-cascader
          v-model="parentIDValue"
          :options="parentIDOptions"
          :props="props"
          @change="handleChange"
          clearable
          :show-all-levels="false"
        />
      </el-form-item>
      <el-form-item label="所属分类" prop="parentId" v-if="!isClassif">
        <el-cascader
          v-model="parentIDValue"
          :options="parentIDOptions"
          :props="props"
          @change="handleChange"
          clearable
          :show-all-levels="false"
        />
      </el-form-item>
      <el-form-item label="级次:" prop="level" v-if="isClassif">
        <el-input
          disabled
          placeholder="由业务类型带出"
          v-model="formAsid.level"
        ></el-input>
      </el-form-item>
      <el-form-item>
        <!-- 分类 -->
        <el-button
          type="primary"
          @click="submitForm(ruleFormRef)"
          v-if="showInsertButton && isClassif"
          >提交</el-button
        >
        <el-button
          type="primary"
          @click="updateAside(ruleFormRef)"
          v-if="!showInsertButton && isClassif"
          >提交</el-button
        >
        <!-- 信息 -->
        <el-button
          type="primary"
          @click="submitForm1(ruleFormRef)"
          v-if="showInsertButton && !isClassif"
          >提交</el-button
        >
        <el-button
          type="primary"
          @click="updateAside1(ruleFormRef)"
          v-if="!showInsertButton && !isClassif"
          >提交</el-button
        >
        <el-button @click="resetForm(ruleFormRef)">清除</el-button>
        <el-button
          type="danger"
          @click="deleteAside"
          v-if="!showInsertButton && isClassif"
          >删除</el-button
        >
        <el-button
          type="danger"
          @click="deleteAside1"
          v-if="!showInsertButton && !isClassif"
          >删除</el-button
        >
      </el-form-item>
    </el-form>
  </div>
  <el-container>
    <el-header height="65px" :style="{ 'border-bottom': '1px solid #ccc' }">
      <!-- 头部按钮 -->
      <el-row type="flex" justify="end" style="background-color: rgb(211, 227, 253)">
        <div>
          <el-button @click="searchButton" type="primary"> 查询</el-button>
          <el-button @click="inseartAdminUser" type="success"> 新增分类</el-button>
          <el-button @click="inseartAdminUser1" type="success"> 新增项目</el-button>
        </div>
        <!-- <div class="title">需求汇总统计表</div> -->
      </el-row>
      <div
        style="
          margin-left: 6rem;
          height: 30px;
          background: rgb(241, 244, 243);
          margin-bottom: 0;
          position: relative;
          display: flex;
          justify-content: flex-start;
        "
      >
        <el-input
          v-model="filterText"
          style="width: 240px"
          placeholder="请输入项目分类"
        />
        <el-input
          style="width: 10%; height: 25px; margin-left: 2px; margin-top: 2px"
          v-model="cCnameInput"
          placeholder="基础信息名称"
        >
          <template #prefix>
            <el-icon class="">
              <search />
            </el-icon>
          </template>
        </el-input>
        <el-input
          style="width: 10%; height: 25px; margin-left: 2px; margin-top: 2px"
          v-model="cCodeInput"
          placeholder="基础信息编号"
        >
          <template #prefix>
            <el-icon class="">
              <search />
            </el-icon>
          </template>
        </el-input>
      </div>
    </el-header>

    <el-container>
      <el-aside
        width="12.5rem"
        :style="{
          'z-index': '1',
          'min-width': '12.5rem',
          height: dynamicHeight + 'px',
          'max-height': dynamicHeight + 'px',
          'overflow-y': 'auto',
          'margin-left': '6rem',
          'border-right': '1px solid #ccc',
        }"
      >
        <!-- style="background: linear-gradient(to right, #f7faff, #ecf9ff)" -->
        <!-- 侧边树状 -->
        <div class="down-tree">
          <el-scrollbar>
            <el-tree
              ref="treeRef"
              class="filter-tree"
              style="max-width: 300px"
              :data="data"
              :props="defaultProps"
              @node-click="handleNodeClick"
              :filter-node-method="filterNode"
            />
          </el-scrollbar>
        </div>
      </el-aside>
      <el-container>
        <el-main style="padding: 2px 2px 0 2px">
          <el-table
            v-loading="loading"
            ref="table"
            :data="tableData"
            border
            stripe
            :cell-style="cellStyle"
            :header-cell-style="headerCellStyle"
            @selection-change="handleSelectionChange"
            @row-dblclick="handleRowClick"
            @row-click="RowClick"
            :row-style="rowState"
            :row-key="(row: any) => row.cId"
            :max-height="screenHeight"
            :height="screenHeight"
            :max-width="'300px'"
          >
            <el-table-column fixed type="index" width="60" align="center" />
            <el-table-column fixed type="selection" width="50" align="center" />
            <!-- <el-table-column fixed prop="cId" label="id" width="70" align="center" /> -->
            <el-table-column prop="cCode" label="编码" width="70" align="center" />
            <el-table-column prop="cName" label="名称" width="150" align="center" />
            <el-table-column prop="cDescription" label="说明" width="90" align="center" />
            <el-table-column prop="cStatus" label="状态" width="90" align="center" />
            <!-- <el-table-column prop="mId" label="分类ID" width="90" align="center" /> -->
            <el-table-column prop="mCode" label="分类编码" width="90" align="center" />
            <el-table-column prop="mName" label="分类名称" width="90" align="center" />
          </el-table>
        </el-main>
        <el-footer style="height: 20px">
          <div class="demo-pagination-block">
            <el-pagination
              v-model:current-page="page"
              v-model:page-size="limit"
              :page-sizes="[50, 500, 1000, 1500, 2000, 8000]"
              :small="true"
              :background="true"
              layout="total, sizes, prev, pager, next, jumper"
              :total="total"
              @size-change="handleSizeChange"
              @current-change="handleCurrentChange"
            />
          </div>
        </el-footer>
      </el-container>
      <el-aside width="20%" :style="{ 'border-left': '1px solid #ccc' }"></el-aside>
    </el-container>
  </el-container>
</template>
<script setup lang="ts">
import {
  ref,
  watch,
  reactive,
  onMounted,
  onBeforeMount,
  computed,
  nextTick,
  onUnmounted,
  toRefs,
} from "vue";
import { Delete, Edit, Search, Share, Upload, Calendar } from "@element-plus/icons-vue";
import {
  ElButton,
  ElDialog,
  dialogEmits,
  ElMessage,
  ElTable,
  TableColumnCtx,
  ElMessageBox,
} from "element-plus";
import type { FormInstance, FormRules } from "element-plus";

import { CircleCloseFilled } from "@element-plus/icons-vue";
import { useRouter } from "vue-router";
import axios from "../../axios/axiosInstance.ts";
import Cookies from "js-cookie";
import { format } from "date-fns";
import zhCn from "element-plus/dist/locale/zh-cn.mjs";
// crud封装组件
import * as crud from "../../components/utils/crud.ts";
import SearchTableDialog from "@/components/dialogs/SearchTableDialog.vue";
import * as notifications from "../../components/utils/notification.ts";

// 权限控制
const searchButtonPermissionsA = ref(false);
const menuId = ref(0);
const buttonVariables = {
  searchButtonPermissionsA,
};
const selectPermissionsButton = () => {
  const userName = Cookies.get("userName");
  axios({
    url: "/select/Permissions/Button",
    method: "post",
    data: {
      userName: userName,
      menuId: menuId.value,
    },
  }).then((res) => {
    res.data.forEach((button) => {
      const buttonName = button.buttonName;
      if (buttonVariables.hasOwnProperty(buttonName)) {
        buttonVariables[buttonName].value = true;
      }
    });
  });
};
selectPermissionsButton();
//权限结束
const value = ref("");
const tableData = ref([]);
const loading = ref(false);
const page = ref(1);
const limit = ref(50);
const total = ref(50);
const dialogVisible = ref(true);
const showInsertButton = ref(true);
const cCodeInput = ref("");
const cCnameInput = ref("");

// 表单规则
interface RuleForm {
  mId: string;
  mCode: string;
  mName: string;
  mDescription: string;
  mStatus: boolean;
  parentId: string;
  level: string;
  cId: string;
  cCode: string;
  cName: string;
  cDescription: string;
  cStatus: boolean;
  classificationId: string;
}
const ruleFormRef = ref<FormInstance>();

const formAsid = ref<RuleForm>({
  mId: "",
  mCode: "",
  mName: "",
  mDescription: "",
  mStatus: true,
  parentId: "",
  level: "",
  cId: "",
  cCode: "",
  cName: "",
  cDescription: "",
  cStatus: true,
  classificationId: "",
  parentID: "",
} as any);
// 规则
const rules = reactive<FormRules<RuleForm>>({
  mName: [{ required: true, message: "请输入分类名称", trigger: "blur" }],
  cName: [{ required: true, message: "请输入项目名称", trigger: "blur" }],
});
const selectedRows = ref([]);
const apiUrl = reactive("/BusinessType/add/BusinessType");
const requestDataAsid = computed(() => ({
  mId: formAsid.value.mId,
  mCode: formAsid.value.mCode,
  mName: formAsid.value.mName,
  mDescription: formAsid.value.mDescription,
  mStatus: formAsid.value.mStatus ? 1 : 0,
  parentId: formAsid.value.parentId,
  level: formAsid.value.level,
  cId: formAsid.value.cId,
  cCode: formAsid.value.cCode,
  cName: formAsid.value.cName,
  cDescription: formAsid.value.cDescription,
  cStatus: formAsid.value.cStatus ? 1 : 0,
  classificationId: formAsid.value.classificationId,
  parentID: formAsid.value.parentID,
}));
const deleteAside = async () => {
  try {
    const result = await notifications.showConfirmDialog("", "请确认删除", "success");
    if (!result) {
      // 如果用户取消操作，则不执行删除操作
      return;
    }

    const res = await crud.sendRequest(
      "/Comp/delete/Aside",
      "post",
      requestDataAsid.value
    );
    selectBusinessTypeAside();
    selectBusinessType();
    resetForm();
  } catch (error) {
    console.error("请求失败:", error);
  }
};

const deleteAside1 = async () => {
  try {
    const result = await notifications.showConfirmDialog("", "请确认删除", "success");
    if (!result) {
      // 如果用户取消操作，则不执行删除操作
      return;
    }

    const res = await crud.sendRequest(
      "/Comp/delete/ComponentItem/BasicInfo",
      "post",
      requestDataAsid.value
    );
    selectBusinessTypeAside();
    selectBusinessType();
    resetForm();
  } catch (error) {
    console.error("请求失败:", error);
  }
};

const submitForm = async (formEl: FormInstance | undefined) => {
  try {
    const result = await notifications.showConfirmDialog("", "请确认提交", "success");
    if (!result) {
      // 如果用户取消操作，则不执行提交操作
      return;
    }

    if (!formEl) return;

    await formEl.validate(async (valid, fields) => {
      if (valid) {
        try {
          const res = await crud.sendRequest(
            "/Comp/add/ComponentItem/Classification/Aside",
            "post",
            requestDataAsid.value
          );
          selectBusinessTypeAside();
          selectBusinessType();
          resetForm();
        } catch (error) {
          console.error("请求失败:", error);
        }
      } else {
        // 处理表单验证失败的情况
      }
    });
  } catch (error) {
    console.error("请求失败:", error);
  }
};
const submitForm1 = async (formEl: FormInstance | undefined) => {
  try {
    const result = await notifications.showConfirmDialog("", "请确认提交", "success");
    if (!result) {
      // 如果用户取消操作，则不执行提交操作
      return;
    }

    if (!formEl) return;

    await formEl.validate(async (valid, fields) => {
      if (valid) {
        try {
          const res = await crud.sendRequest(
            "/Comp/add/ComponentItem/BasicInfoTable/",
            "post",
            requestDataAsid.value
          );
          selectBusinessTypeAside();
          selectBusinessType();
          resetForm();
        } catch (error) {
          console.error("请求失败:", error);
        }
      } else {
        // 处理表单验证失败的情况
      }
    });
  } catch (error) {
    console.error("请求失败:", error);
  }
};

const updateAside = async (formEl: FormInstance | undefined) => {
  try {
    const result = await notifications.showConfirmDialog("", "请确认提交", "success");
    if (!result) {
      // 如果用户取消操作，则不执行更新操作
      return;
    }

    if (!formEl) return;
    formAsid.value.status = formAsid.value.isLeaf ? "1" : "0";

    await formEl.validate(async (valid, fields) => {
      if (valid) {
        try {
          const res = await crud.sendRequest(
            "/Comp/update/Aside",
            "post",
            requestDataAsid.value
          );
          selectBusinessTypeAside();
          selectBusinessType();
          resetForm();
        } catch (error) {
          console.error("请求失败:", error);
        }
      } else {
        // 处理表单验证失败的情况
      }
    });
  } catch (error) {
    console.error("请求失败:", error);
  }
};

const updateAside1 = async (formEl: FormInstance | undefined) => {
  console.log(requestDataAsid.value);
  try {
    const result = await notifications.showConfirmDialog("", "请确认更新", "success");
    if (!result) {
      // 如果用户取消操作，则不执行更新操作
      return;
    }

    if (!formEl) return;
    formAsid.value.status = formAsid.value.isLeaf ? "1" : "0";

    await formEl.validate(async (valid, fields) => {
      if (valid) {
        try {
          const res = await crud.sendRequest(
            "/Comp/update/ComponentItem/BasicInfo",
            "post",
            requestDataAsid.value
          );
          selectBusinessTypeAside();
          selectBusinessType();
          resetForm();
        } catch (error) {
          console.error("请求失败:", error);
        }
      } else {
        // 处理表单验证失败的情况
      }
    });
  } catch (error) {
    console.error("请求失败:", error);
  }
};

const resetForm = (formEl: FormInstance | undefined) => {
  parentIDValue.value = "";
  if (!formEl) return;
  formEl.resetFields();
};
const table = ref();
const cellStyle = ({ row, column, rowIndex, columnIndex }) => {
  if (selectedRows.value.find((selectedRow) => selectedRow.cId === row.cId)) {
    if (column.property === "description" || column.property === "name") {
      return {
        backgroundColor: "#DFF0DB !important",
        borderColor: "#B9C9C7",
        padding: "4px",
        textAlign: "left",
      };
    }
    return {
      backgroundColor: "#DFF0DB !important",
      borderColor: "#B9C9C7",
      padding: "4px",
    };
  } else {
    if (column.property === "description" || column.property === "name") {
      return {
        padding: "4px",
        textAlign: "left",

        margin: 0,
        borderColor: "#B9C9C7",
      };
    }
    return { borderColor: "#B9C9C7", padding: "4px", margin: 0 };
  }
};
const headerCellStyle = {
  borderColor: "#B9C9C7",
  backgroundColor: "#F2F4FA", // 表头背景颜色
  fontWeight: "bold", // 表头文字粗细
  color: "#1F2129",
};

const handleSelectionChange = (selection: any) => {
  selectedRows.value = selection;
};
const RowClick = async (row, selection) => {
  table.value.toggleRowSelection(row);
  showInsertButton.value = false;
  isClassif.value = false;
  await asideList();
  if (row.mId == 1) {
    parentIDValue.value[0] = 1;
    formAsid.value.parentID = 1;
  } else {
    const parentIds = getParentIds(row.mId);
    parentIDValue.value = parentIds;
    formAsid.value.parentID = parentIds[parentIds.length - 1];
  }
  formAsid.value.cId = row.cId;
  formAsid.value.cCode = row.cCode;
  formAsid.value.cName = row.cName;
  formAsid.value.cDescription = row.cDescription;
  //   formAsid.value.cStatus = row.cStatus = 1 ? true : false;
  formAsid.value.cStatus = row.cStatus == 1 ? false : true;
};
const rowState = (arg) => {
  return {
    height: "20px", // 设置合适的行高值
    fontSize: "12px", // 设置合适的字体大小值
    // color: "black",
  };
};
const dynamicHeightYtfl = ref(null);
const dynamicHeight = ref(null);
const screenHeight = ref(null);

const getScreenHeight = () => {
  dynamicHeight.value = `${window.innerHeight - 111}`;
  screenHeight.value = window.innerHeight - 146;
};
getScreenHeight();
const treeRef = ref<InstanceType<typeof ElTree>>();
const filterText = ref("");
watch(filterText, (val) => {
  treeRef.value!.filter(val);
});
const filterNode = (value: string, data: Tree) => {
  if (!value) return true;
  return data.label.includes(value);
};

interface Tree {
  label: string;
  children?: Tree[];
}
const asideListData = ref([]);

const asideList = async () => {
  // async 函数声明需要使用 async 关键字
  try {
    const res = await crud.fetchData("/Comp/select/Aside", "post", requestData.value);

    asideListData.value = res; // 将结果赋值给 ref
  } catch (error) {
    console.error("请求失败:", error);
  }
};

const handleNodeClick = async (data: Tree) => {
  try {
    const res = await crud.fetchData(
      "/Comp/select/ComponentItem/Classification/Text/Aside",
      "post",
      { parentID: data.mid }
    );
    total.value = 0;
    console.log(res);
    tableData.value = res.map((item: any) => ({
      cStatus: item.cstatus === 1 ? "启用" : "未启用",
      cId: item.cid,
      cCode: item.ccode,
      cName: item.cname,
      cDescription: item.cdescription,
      mId: item.mid,
      mCode: item.mcode,
      mName: item.mname,
      parentId: item.parentId,
    }));
  } catch (error) {
    console.error("请求失败:", error);
  }
  showInsertButton.value = false;
  isClassif.value = true;
  await asideList();
  for (let i = 0; i < asideListData.value.length; i++) {
    if (asideListData.value[i].mid == data.parentId) {
      // 当前节点的父级内容
      var matchedNode = asideListData.value[i];
      break;
    }
  }

  if (matchedNode == null || matchedNode == undefined) {
    parentIDValue.value[0] = "1";
    formAsid.value.parentID = 1;
  } else {
    const ids = getParentIds(data.parentId);
    parentIDValue.value = ids;
    formAsid.value.parentID = matchedNode.mId;
  }

  formAsid.value.level = data.level;
  formAsid.value.mId = data.mid;
  formAsid.value.mCode = data.mcode;
  formAsid.value.mName = data.mname;
  formAsid.value.mDescription = data.mdescription;
  formAsid.value.mStatus = data.mstatus == 1 ? true : false;
};
const getParentIds = (nodeId) => {
  const parentIds = [];
  let currentNode = asideListData.value.find((node) => node.mid === nodeId);
  while (currentNode && currentNode.parentId !== undefined) {
    parentIds.push(currentNode.mid);
    currentNode = asideListData.value.find((node) => node.mid === currentNode.parentId);
  }
  return parentIds.reverse();
};

const data: ref<Tree[]> = ref([]);
const parentIDOptions = ref([]);

const defaultProps = {
  children: "children",
  label: "label",
};

const requestData = computed(() => ({}));
const transformResToOption = (data) => {
  const transform = (items) => {
    return items.map((item) => ({
      value: item.mid,
      label: item.mname,
      level: item.level,
      children: item.children ? transform(item.children) : [],
    }));
  };

  return transform(data);
};
const selectBusinessTypeAside = async () => {
  try {
    const res = await crud.fetchData(
      "/Comp/select/ComponentItem/Classification/Aside",
      "post",
      requestData.value
    );
    data.value = res;
    const transformedRes = transformResToOption(res);
    parentIDOptions.value = transformedRes;
  } catch (error) {
    console.error("请求失败:", error);
  }
};

const selectBusinessDate = computed(() => ({
  page: page.value,
  limit: limit.value,
  cCodeInput: cCodeInput.value,
  cCnameInput: cCnameInput.value,
}));

const selectBusinessType = async () => {
  loading.value = true;
  try {
    const res = await crud.fetchData(
      "/Comp/select/ComponentItem/Classification/Text",
      "post",
      selectBusinessDate.value
    );
    if (res.length == 0) {
      total.value = 0;
      tableData.value = [];
      loading.value = false;
      return;
    }
    total.value = 0;
    const definitionsList = res;
    total.value = definitionsList[0].total;
    loading.value = false;
    tableData.value = definitionsList.map((item: any) => ({
      cStatus: item.cstatus === 1 ? "启用" : "未启用",
      cId: item.cid,
      cCode: item.ccode,
      cName: item.cname,
      cDescription: item.cdescription,
      mId: item.mid,
      mCode: item.mcode,
      mName: item.mname,
      parentId: item.parentId,
    }));
  } catch (error) {
    loading.value = false;
    console.error("请求失败:", error);
  }
};
const searchButton = (val: number) => {
  selectBusinessType();
};
const handleSizeChange = (val: number) => {
  selectBusinessType();
};
const handleCurrentChange = (val: number) => {
  selectBusinessType();
};
selectBusinessTypeAside();
selectBusinessType();
const parentIDValue = ref([]);
const props = {
  checkStrictly: true,
};
const findLevelByValue = (options, targetValue) => {
  for (const option of options) {
    // 如果当前选项的值与目标值匹配，则返回该选项的级别
    if (option.value === targetValue) {
      return option.level;
    }
    // 如果当前选项有子选项，则递归调用该函数
    if (option.children && option.children.length > 0) {
      const level = findLevelByValue(option.children, targetValue);
      // 如果在子选项中找到了目标值，则返回找到的级别
      if (level !== undefined) {
        return level;
      }
    }
  }
  // 如果未找到目标值，则返回 undefined
  return undefined;
};

const handleChange = (value) => {
  if (value == null) {
    formAsid.value.level = "";
    return;
  }
  const selectedValue = value[value.length - 1];
  formAsid.value.parentID = selectedValue;
  const level = findLevelByValue(parentIDOptions.value, selectedValue);
  if (level !== undefined) {
    formAsid.value.level = level + 1;
  } else {
    formAsid.value.level = -1;
  }
};
const clearFormAsid = () => {
  for (const key of Object.keys(formAsid.value)) {
    if (typeof formAsid.value[key] === "string") {
      formAsid.value[key] = "";
    } else if (typeof formAsid.value[key] === "boolean") {
      formAsid.value[key] = true;
    } else if (typeof formAsid.value[key] === "number") {
      formAsid.value[key] = ""; // 或者设置为默认值
    } else if (Array.isArray(formAsid.value[key])) {
      formAsid.value[key] = []; // 清空数组
    } else {
      // 其他类型的属性，根据需要进行处理
    }
  }
};
const isClassif = ref(true);
// 添加分类
const inseartAdminUser = () => {
  isClassif.value = true;
  showInsertButton.value = true;
  parentIDValue.value = "";
  clearFormAsid();
};
// 添加信息
const inseartAdminUser1 = () => {
  isClassif.value = false;
  showInsertButton.value = true;
  parentIDValue.value = "";
  clearFormAsid();
};
</script>

<style scoped>
.el-table {
  /* --el-table-row-hover-bg-color: rgba(0, 158, 250, 0.219) !important; */
  /* --el-table-row-hover-bg-color: #fef5f0 !important; */
  --el-table-row-hover-bg-color: rgba(254, 245, 240, 0.8) !important;
}

/* 选中 */
.el-table {
  /* --el-table-row-hover-bg-color: #fef5f0 !important; */
  --el-table-row-hover-bg-color: rgba(254, 245, 240, 0.8) !important;
}

.down-tree ::v-deep .el-tree-node.is-expanded > .el-tree-node__children {
  display: inline;
}

.down-tree {
  height: 100%;
}

.demo-pagination-block {
  float: right;
}

.custom-dialog {
  position: fixed;
  top: 10em;
  left: 50%;
  width: 20%;
  /* 其他样式... */
}
</style>
